<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>三列中间自适应布局</title>
<meta name="author" content="" />
<meta name="keywords" content="" />
<meta name="description" content="" />
<style>
body{margin:0;}
.header{height:100px; margin:0 auto 10px; background:blue;color:#fff; font-size:20px; font-weight:bolder}
.wrapper{overflow:hidden;position:relative;width:100%}
.wrapper div{height:300px;}
.nav{ width:150px;position:absolute;top:0;left:0;background:pink;}
.main{background:red;margin: 0 200px 0 150px;}
.links{ width:200px; background:yellow;position:absolute;top:0;right:0;}

.foot{ height:100px;clear:both;background:#ccc;margin-top:10px;}
</style>
</head>

<body>
<div class="header">左中右三列, 中间宽度自适应, 中间内容区滞后加载 - absolute position</div>
<div class="wrapper">
	<div class="nav">  nav nav nav nav nav nav nav nav nav nav nav nav nav nav nav nav nav nav nav nav nav nav nav nav nav nav nav nav nav nav nav nav nav navnav</div>
	<div class="links">links</div>
	<div class="main">main</div>
</div>
<div class="foot"></div>
</body>
</html>
